<template>
    <div class="entrepot zy-content ">
        <div class="searchBox">
            <Form :label-width="100" class="search-form">
                <Row>
                    <Col :span="span">
                        <FormItem label="使用公司：">
                            <Select
                                    v-model="searchParams.company"
                                    clearable
                                    :placeholder="`${$t('common.selectInfo')}`"
                            >
                                <Option v-for="(item,index) of factoryList" :value="item.id" :key="index">{{ item.name }}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                    <Col :span="span">
                        <FormItem label="成本中心：">
                            <Input type="number" clearable v-model="searchParams.costCenter" :placeholder="`${$t('common.inputInfo')}`" class="inputBorder" :maxlength="32"></Input>
                        </FormItem>
                    </Col>
                    <Col :span="span">
                        <FormItem label="人员工号：">
                            <Input type="text" clearable v-model="searchParams.moveInAdminNo" :placeholder="`${$t('common.inputInfo')}`" class="inputBorder" :maxlength="32"></Input>
                        </FormItem>
                    </Col>
                    <Col :span="span">
                        <FormItem label="人员名称：">
                            <Input type="text" clearable v-model="searchParams.moveInAdminName" :placeholder="`${$t('common.inputInfo')}`" class="inputBorder" :maxlength="32"></Input>
                        </FormItem>
                    </Col>
                    <Col :span="span" align="center">
                        <Button type="primary" @click="changeNum" v-if="checkBtnPermission.dmsUserCostCenterList">{{$t('common.Query')}}</Button>
                    </Col>
                </Row>
            </Form>
        </div>
        <div class="btns clear">
            <!--            <strong class="creatBtnleft"><Button type="primary" shape="circle">批量删除</Button></strong>&ndash;&gt;-->
            <!--            <span  class="creatBtnright" @click="addDeviceType">-->
            <!--                <span><Icon type="ios-cloud-download-outline" /></span>-->
            <!--                <span class="rightbtn">{{$t('common.Import')}}</span>-->
            <!--            </span>-->
            <span  class="creatBtnright" @click="handleAdd" v-if="checkBtnPermission.dmsUserCostCenterAdd">
                <span><Icon type="ios-add-circle-outline"/></span>
                <span class="rightbtn">添加成本中心用户</span>
            </span>
        </div>
        <div class="tableContent">
            <Table row-key="id" :columns="columns" :data="data">
                <template slot-scope="{ row }" slot="action">
                    <span class="operationBtn" v-if="checkBtnPermission.dmsUserCostCenterDelete" @click="handleDelete(row)">{{$t('common.Delete')}}</span>
                    <span class="operationBtn" v-if="checkBtnPermission.dmsUserCostCenterEdit" @click="handleEdit(row)">{{$t('common.Edit')}}</span>
                    <span class="operationBtn" v-if="checkBtnPermission.dmsUserCostCenterDetail" @click="handleDetail(row)">{{$t('common.Check')}}</span>
                </template>
            </Table>
        </div>
        <div class="pageWrap">
            <Page :total="total" :page-size="pageSize" :page-size-opts="$variable.pageSizes" :current="pageNum" @on-change="changePageNum" @on-page-size-change="changePageSize" show-sizer show-total />
        </div>
        <!--图片模态框-->
        <centerUserModal ref="centerUserModal" @refresh="handleRefresh"/>
        <Modal :mask-closable="false"
                v-model="delelteVisible"
                title="">
            <Row class="enableContent">
                <Col span="24" class="enableContentInner">
                    <img width="95px" src="~images/event/del.png" alt="">
                </Col>
                <Col span="24" class="enableTips">
                    <span>{{$t('common.sureDelete')}}</span>
                </Col>
            </Row>
            <div slot="footer">
                <Button type="default"  @click="delelteVisible = false">{{$t('common.Cancle')}}</Button>
                <Button type="primary" :loading="delLoading" @click="handleDeleteOk">{{$t('maintenance.Confirmed')}}</Button>
            </div>
        </Modal>
    </div>
</template>

<script>
    import centerUserModal from './modules/centerUserModal'
    export default {
        name: "centerUser",
        components: {
            centerUserModal
        },
        data() {
            return {
                delId: '',
                delLoading: false,
                delelteVisible: false,
                previewVisible: false,
                pageNum:1,
                pageSize:10,
                total:0,
                imgUrlList: [],
                pageSizeOption: [10,20,30,40],
                span: 4,
                searchParams: {},
                checkBtnPermission: {},
                columns: [
                    {
                        title: '使用公司',
                        key: 'companyName',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '成本中心',
                        key: 'costCenter',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '成本中心名称',
                        key: 'costCenterName',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '人员工号',
                        key: 'moveInAdminNo',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '人员名称',
                        key: 'moveInAdminName',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '创建人',
                        key: 'realname',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: '创建时间',
                        key: 'createTime',
                        align: 'center',
                        minWidth: 200,
                    },
                    {
                        title: `${ this.$t('common.operation') }`,
                        slot: "action",
                        minWidth: 200,
                        align: 'center',
                        fixed: 'right'
                    },
                ],
                data: [],
                factoryList: []
            }
        },
        created() {
            this.changeNum()
            this.getCompanyList()
        },
        mounted() {
            let itemList = JSON.parse(window.localStorage.getItem('USER_URI'))
            for(let item of itemList){
                if(item.code=="dmsUserCostCenterAdd"){
                    this.checkBtnPermission.dmsUserCostCenterAdd = true
                }
                if(item.code=="dmsUserCostCenterEdit"){
                    this.checkBtnPermission.dmsUserCostCenterEdit = true
                }
                if(item.code=="dmsUserCostCenterDetail"){
                    this.checkBtnPermission.dmsUserCostCenterDetail = true
                }
                if(item.code=="dmsUserCostCenterDelete"){
                    this.checkBtnPermission.dmsUserCostCenterDelete = true
                }
                if(item.code=="dmsUserCostCenterList"){
                    this.checkBtnPermission.dmsUserCostCenterList = true
                }
            }
        },
        methods: {
            /**************获取相关下拉数据列表*************/
            getCompanyList() {
                this.axios({
                    method: 'get',
                    url: '/basic/company/getCompanyListByUser',
                    params: {}
                }).then(res => {
                    if (res.code === 200) {
                        let arr = res.data.map(item => {
                            return {
                                ...item,
                                id: item.id.toString()
                            }
                        })
                        this.factoryList = arr
                    } else {
                        this.$Message.warning(({content: res.msg, duration: 6, closable: true}));
                    }
                })
            },
            //新增
            handleAdd() {
                this.$refs.centerUserModal.show('add')
            },
            handleDelete(record) {
                this.delelteVisible = true
                this.delId = record.id
            },
            //编辑
            handleEdit(record) {
                this.$refs.centerUserModal.show('edit',record)
            },
            handleDetail(record) {
                this.$refs.centerUserModal.show('detail',record, true)
            },
            //刷新
            handleRefresh() {
                this.searchList()
            },
            //分页
            changeNum(){
                this.pageNum = 1;
                this.searchList();
            },
            changePageSize(pageSize) {
                this.pageSize = pageSize;
                this.searchList();
            },
            changePageNum(val){
                this.pageNum = val;
                this.searchList();
            },
            searchList(){//查询列表
                let params = {
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                };
                for (let key in this.searchParams) {
                    if (this.searchParams[key]) {
                        this.$set(params, key, this.searchParams[key])
                    }
                }
                // if(this.searchParams.status==3){
                //   params.status = 0
                // }
                // if(this.dateList[1]){
                //     params.startTime = this.$moment(this.dateList[0]).format('YYYY-MM-DD');
                //     params.endTime = this.$moment(this.dateList[1]).format('YYYY-MM-DD');
                // }
                this.axios({
                    method: 'get',
                    url: '/dms/dmsUserCostCenter/list',
                    params: params
                }).then(res => {
                    if(res.code === 200){
                        this.data = res.data.list
                        this.total = res.data.total
                    }else{
                        this.$Message.warning(({content:res.msg,duration:6,closable:true}));
                    }
                })
            },
            handleDeleteOk() {
                this.delLoading = true
                this.axios({
                    method: 'post',
                    url: '/dms/dmsUserCostCenter/delete',
                    params: {
                        id: this.delId
                    }
                }).then(res => {
                    
                    if(res.code === 200){
                        this.searchList()
                        this.$Message.success('删除成功！')
                    }else{
                        this.$Message.warning(({content:res.msg,duration:6,closable:true}));
                    }
                }).finally(() => {
                    this.delelteVisible = false
                    this.delLoading = false
                })
            }
        }
    }
</script>

<style scoped>

</style>
